<template>
	<view class="superDetails">
		<view class="superDetails_tab">
			<tabcut @tab="changeBtnOK" :Cuts="list4" :scrollable="false" :lineWidth="100"></tabcut>
		</view>
		<view v-if="active == 1" class="changeLeft_style">
			<scroll-view scroll-y="true" enable-back-to-top="true" lower-threshold="112" class="scrollbox">
				<uni-section title="基础用法" type="line">
					<uni-list>
						<uni-list-item title="所属项目" :rightText="isData.pjId_dictText || '- -'" />
						<uni-list-item title="所属计划" :rightText="isData.planId_dictText || '- -'" />
						<uni-list-item title="检查开始时间" :rightText="isData.checkBeginTime || '- -'" />
						<uni-list-item title="检查结束时间" :rightText="isData.checkEndTime || '- -'" />
						<uni-list-item title="检查方式" :rightText="isData.scCheckWay_dictText || '- -'" />
						<!-- <uni-list-item title="被检查单位负责人" rightText="右侧文字" /> -->
						<uni-list-item title="是否存在问题" :rightText="isData.izProblem_dictText || '- -'" />
						<uni-list-item title="被检查单位意见" :note="isData.inspeOrgAdv" />
						<view v-for="(item, index) in checkContData" :key="index" class="">
							<uni-list-item :title="item.FIELD_NAME" :note="item.CONTENT" />
						</view>

						<uni-list-item title="备注" :note="isData.note || '无'"></uni-list-item>
					</uni-list>
				</uni-section>

				<u-popup :show="disposalShow" mode="bottom" @close="disposalClose" @open="disposalOpen">
					<view class="disposal_style">
						<view class="">
							<uni-section title="监察描述" type="line">
								<uni-easyinput type="textarea" autoHeight v-model="monitorValueOne" placeholder="请输入内容"></uni-easyinput>
							</uni-section>
						</view>
						<view class="popup_style">
							<button class="popup_buttom" @click="monitorValueOneBtnOK" type="submit">提交处理</button>
							<button style="background-color: aliceblue; color: black" class="popup_buttom" @click="disposalShow = false" type="submit">关闭</button>
						</view>
					</view>
				</u-popup>
				<view class="fillLogs_button">
					<button class="popup_buttom" @click="disposalShow = true" type="submit">监察处理</button>
				</view>
			</scroll-view>
		</view>
		<view v-else class="changeRight_style">
			<scroll-view scroll-y="true" enable-back-to-top="true" lower-threshold="112" class="scrollbox">
				<uni-section title="基本信息" type="line">
					<uni-list>
						<uni-list-item title="整改人" :rightText="isDataTow.dealBy" />
						<uni-list-item title="整改时间" :rightText="isDataTow.dealTime || '- -'" />
						<uni-list-item title="问题描述" :note="isDataTow.probDesc" />
						<uni-list-item title="整改描述" :note="isDataTow.dealDesc || '- -'" />
						<uni-list-item title="备注" :note="isDataTow.note || '- -'" />
						<uni-list-item title="问题状态" :rightText="isDataTow.scProbStatus_dictText" />
						<!-- <uni-list-item title="附件" :rightText="右侧文字" /> -->
					</uni-list>
				</uni-section>
				<view style="margin-top: 20rpx">
					<uni-section title="监察记录" type="line">
						<uni-list>
							<uni-list-item title="监察时间" :rightText="isDataTow.monitorTime || '- -'" />
							<uni-list-item title="监察状态" :rightText="isDataTow.scMonitorStatus_dictText || '- -'" />
							<uni-list-item title="监察描述" :note="isDataTow.monitorDesc || '- -'" />
						</uni-list>
					</uni-section>
				</view>

				<u-popup :show="disposalShow" mode="bottom" @close="disposalClose" @open="disposalOpen">
					<view class="disposal_style">
						<view class="">
							<uni-section title="监察状态" type="line">
								<uni-data-select v-model="scMonitorValue" :localdata="range" @change="change"></uni-data-select>
							</uni-section>
							<uni-section title="监察描述" type="line">
								<uni-easyinput type="textarea" autoHeight v-model="monitorValue" placeholder="请输入监察描述内容"></uni-easyinput>
							</uni-section>
						</view>
						<view class="popup_style">
							<button class="popup_buttom" @click="monitorValueBtnOK" type="submit">提交处理</button>
							<button style="background-color: aliceblue; color: black" class="popup_buttom" @click="disposalShow = false" type="submit">关闭</button>
						</view>
					</view>
				</u-popup>
				<view class="fillLogs_button">
					<button class="popup_buttom" @click="disposalShow = true" type="submit">监察处理</button>
				</view>
			</scroll-view>
		</view>
		<u-loading-page :loading="queryById" loading-text="加载中..."></u-loading-page>
	</view>
</template>

<script>
import { getQueryById, postTaskMonitor, postProbMonitor } from '@/api/mappages/supervise/supervise.js';
import tabcut from '@/components/Tabcut.vue';
export default {
	components: {
		tabcut
	},
	data() {
		return {
			scMonitorValue: '',
			monitorValue: '',
			monitorValueOne: '',
			range: [
				{ value: 0, text: '未查' },
				{ value: 1, text: '差' },
				{ value: 2, text: '良' },
				{ value: 3, text: '优' }
			],
			disposalShow: false,
			list4: [
				{
					name: '任务执行情况',
					type: 1
				},
				{
					name: '问题记录反馈',
					type: 2
				}
			],
			active: 1,
			optionsData: '',
			queryById: false,
			isDataTow: '',
			isData: '',
			checkContData: ''
		};
	},
	created() {
		this.queryById = true;
	},
	onLoad(options) {
		if (options.WoID) {
			this.optionsData = options.WoID;
			console.log(this.optionsData, '``````````````'); // 现在可以使用传递的 item 数据
		}
		this.detailMyPj();
	},
	methods: {
		async detailMyPj() {
			this.queryById = true;
			getQueryById(this.optionsData)
				.then((res) => {
					if (res.result) {
						this.isDataTow = res.result.pmpScProbRecord;
						this.isData = res.result.pmpScTaskRecord;
						this.checkContData = JSON.parse(this.isData.checkCont);
						console.log(this.isData, 'this.isData');
						console.log(this.checkContData, 'this.checkContData');
					} else {
						this.$tab.navigateTo(`/mappages/supervise/supervise`);
						this.$common.errorToShow('查询失败');
					}
					this.queryById = false;
				})
				.catch((err) => {
					this.queryById = false;
					this.$tab.navigateTo(`/mappages/supervise/supervise`);
					this.$common.errorToShow('查询失败');
				});
		},
		changeBtnOK(e) {
			this.active = e.type;
		},
		disposalOpen() {
			// console.log('open');
		},
		disposalClose() {
			this.disposalShow = false;
			// console.log('close');
		},
		monitorValueOneBtnOK() {
			this.queryById = true;
			this.disposalShow = false;
			let arr = {
				id: this.optionsData,
				monitorDesc: this.monitorValueOne,
				monitorTime: this.$common.timeToDate(new Date().getTime())
			};
			postTaskMonitor(arr)
				.then((res) => {
					this.$common.successToShow(res.result);
					this.disposalShow = false;
					this.queryById = false;
				})
				.catch((err) => {
					this.queryById = false;
				});
		},
		monitorValueBtnOK() {
			this.queryById = true;
			this.disposalShow = false;
			let arr = {
				id: this.optionsData,
				monitorDesc: this.monitorValueOne,
				monitorTime: this.$common.timeToDate(new Date().getTime()),
				scMonitorStatus: this.scMonitorValue
			};
			postProbMonitor(arr)
				.then((res) => {
					this.$common.successToShow(res.result);
					this.disposalShow = false;
					this.queryById = false;
				})
				.catch((err) => {
					this.queryById = false;
				});
		}
	}
};
</script>

<style scoped lang="scss">
.superDetails {
	width: 100vw;
}
.scrollbox {
	height: calc(100vh - 260rpx);
}

.superDetails_tab {
	background-color: #fff;
}

.fillLogs_button {
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100vw;
	height: 100rpx;
	background-color: #fff;
	display: flex;
	align-items: center;
}
.fillLogs_button button {
	width: 50%;
	background-color: #2e87ff;
	color: #fff;
	border-radius: 20rpx;
}

.fillLogs_button button:hover {
	background-color: #2e87ff;
	box-shadow: 0px 0px 20px -18px;
}

.fillLogs_button button:active {
	transform: scale(0.95);
}

.disposal_style {
	.disposal_text {
		text-align: center;
		font-size: 28rpx;
		font-weight: 700;
		padding: 22rpx 0;
	}
}

.popup_style {
	padding: 30rpx;
	display: flex;
	flex-direction: row;
}
.popup_buttom {
	background-color: #2e87ff;
	color: #fff;
	width: 40%;
	font-size: 22rpx;
	line-height: 66rpx;
}

.changeLeft_style {
	padding-bottom: 100rpx;
}

.changeRight_style {
	min-height: calc(100vh - 260rpx);
	background: #fff;
	padding-bottom: 100rpx;
}

.text {
	font-size: 12px;
	color: #666;
	margin-top: 5px;
}

.uni-px-5 {
	padding-left: 10px;
	padding-right: 10px;
}

.uni-pb-5 {
	padding-bottom: 10px;
}

/deep/ .u-transition {
	z-index: 9900;
}
</style>
